<!-- 游戏包支付编辑弹窗 -->
<template>
  <el-dialog
    :title="'支付配置'"
    :visible="visible"
    width="650px"
    :destroy-on-close="true"
    :lock-scroll="false"
    @update:visible="updateVisible"
    :close-on-click-modal="false"
  >
    <el-form
      ref="form"
      v-loading="isloading"
      :model="form"
      :rules="rules"
      label-width="150px"
    >
      <div
        style="font-size: smaller; text-indent: 65px; line-height: 30px; color: #F56C6C; "
      >
        <b>
          配置说明：
        </b>
      </div>
      <div
        style="font-size: smaller; text-indent: 65px; line-height: 30px; color: #F56C6C; "
      >
        <b>
          1.微信、微信服务商不能同时开启
        </b>
      </div>
      <div
        style="font-size: smaller; text-indent: 65px; line-height: 30px; color: #F56C6C; "
      >
        <b>
          2.开启扫码时，支付宝必须同步开启。微信、微信服务商必须开启一种
        </b>
      </div>
      <el-form-item v-if="payWay.length" label="支付方式:">
        <el-checkbox-group v-model="form.pay_way">
          <el-checkbox
            v-for="item in payWay"
            :key="item.name"
            :label="item.id * 1"
            >{{ item.name }}
          </el-checkbox>
        </el-checkbox-group>
      </el-form-item>
      <el-form-item label="支付类型:" prop="pay_type">
        <el-radio-group v-model="form.pay_type" prop="pay_type">
          <el-radio :label="1">网页支付</el-radio>
          <el-radio :label="2">渠道支付</el-radio>
        </el-radio-group>
      </el-form-item>
      <div>
        <div
          style="font-size: smaller; text-indent: 65px; line-height: 30px; color: #F56C6C;"
        >
          请选择对应的收款账户
        </div>
      </div>
      <div v-if="payWay.length">
        <el-form-item
          v-for="item in payWay"
          :key="item.id + item.name"
          :label="item.name + ':'"
        >
          <el-select v-model="form.payment_id_config[item.id]">
            <el-option
              v-for="group in item.list"
              :key="group.company + group.id"
              :label="group.company"
              :value="group.id"
            ></el-option>
          </el-select>
        </el-form-item>
      </div>
    </el-form>
    <div slot="footer">
      <el-button @click="updateVisible(false)">取消</el-button>
      <el-button type="primary" @click="save" :loading="loading"
        >保存
      </el-button>
    </div>
  </el-dialog>
</template>

<script>
// import PageSelect from '@/components/pageSelect/index.vue'
import getdata from "../../../utils/request/request.js";
export default {
  name: "PackagePayEdit",
  props: {
    // 弹窗是否打开
    visible: Boolean,
    // 修改回显的数据
    data: Object,
    //多条配置选中的数据id集合
    selectPackage:String,
  },
  // components: { PageSelect },
  data() {
    return {
      // 表单数据
      form: Object.assign({}),
      // 表单验证规则
      rules: {
        pay_way: [
          { required: true, message: "请选择支付方式", trigger: "blur" }
        ],
        pay_type: [
          { required: true, message: "请选择支付类型", trigger: "blur" }
        ]
      },

      // 提交状态
      loading: false,
      // 是否是修改
      isUpdate: false,
      // 支付方式
      payWay: [],
      packageId: "",
      pay_type: "",
      isloading: false,
      paymentaccountAll: []
    };
  },
  created() {
    if (this.visible) {
      this.getAll();
      if (this.data) {
        this.packageId = this.data.id;
        this.$http
          .get("/Package/getPackageConfig?package_id=" + this.packageId)
          .then(res => {
            if (res.data.code === 0) {
              if (res.data.data) {
                res.data.data.pay_way.forEach((item, index) => {
                  this.$set(res.data.data.pay_way, index, item * 1);
                });
                this.form = JSON.parse(JSON.stringify(res.data.data));
              } else {
                this.form = {
                  pay_way: [],
                  pay_type: 1,
                  package_id: this.packageId
                };
              }
            } else {
              this.$message.error(res.data.msg);
            }
          })
          .catch(e => {
            this.$message.error(e.message);
          });
        this.isUpdate = true;
      } else {
        this.form = {
          pay_way: [],
          pay_type: 1,
        };
        this.isUpdate = false;
      }
    }
  },
  watch: {
    visible() {
      if (this.data) {
        this.isUpdate=true
      }else{
        this.isUpdate=false
      }
    }
  },
  methods: {
    /* 保存编辑 */
    async getPaymentaccountAll(pay_way_id, item) {
      let res = await getdata(
        this.$http.post("/paymentaccount/getAll", { pay_way_id })
      );
      if (res.code === 0) {
        this.$set(item, "list", res.data);
      } else {
        this.$set(item, "list", []);
      }
    },
    getAll() {
      this.isloading = true;
      this.$http.post("/payway/getAll").then(res => {
        if (res.data.code === 0) {
          res.data.data.forEach(async item => {
            await this.getPaymentaccountAll(item.id, item);
            if (!this.form.payment_id_config) {
              let obj = {};
              res.data.data.forEach(item => {
                this.$set(obj, item.id, "");
              });
              this.$set(this.form, "payment_id_config", obj);
            }
            this.payWay = res.data.data;
            this.isloading = false;
          });
        }
      });
    },
    save() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          this.$confirm('执行该操作将覆盖收款账户，请确认是否保存！', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          if(this.isUpdate){
            let form = {
              pay_way: this.form.pay_way,
              pay_type: this.form.pay_type,
              package_id: this.form.package_id,
              payment_id_config: this.form.payment_id_config
            };
            this.loading = true;
            this.$http
              .post("/Package/setPackagePayConfig", form)
              .then(res => {
                this.loading = false;
                if (res.data.code === 0) {
                  this.$message.success(res.data.msg);
                  if (!this.isUpdate) {
                    this.form = {};
                  }
                  this.updateVisible(false);
                  this.$emit("done");
                } else {
                  this.$message.error(res.data.msg);
                }
              })
              .catch(e => {
                this.loading = false;
                this.$message.error(e.message);
              });
          }else{
            this.loading = true;
            let  form = {
              pay_way: this.form.pay_way,
              pay_type: this.form.pay_type,
              package_id: this.selectPackage.split(","),
              payment_id_config: this.form.payment_id_config
            };
            this.$http
              .post("/Package/batchSetPackagePaymentConfig", form)
              .then(res => {
                this.loading = false;
                if (res.data.code === 0) {
                  this.$message.success(res.data.msg);
                  if (!this.isUpdate) {
                    this.form = {};
                  }
                  this.updateVisible(false);
                  this.$emit("done");
                } else {
                  this.$message.error(res.data.msg);
                }
              })
              .catch(e => {
                this.loading = false;
                this.$message.error(e.message);
              });
          }
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消保存'
          });          
        });

        }
      });
    },
    /* 更新visible */
    updateVisible(value) {
      this.$emit("update:visible", value);
      console.log(this.form, "!!");
    }
  }
};
</script>

<style scoped></style>
